<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="Description" content="ARCHIVE"/>
		<meta name="Keywords" content="ARCHIVE"/>
		<meta name="render" content="webkit"/>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>blog-detail</title>
		<link rel="shortcut icon" href=""/>
		<link href="//cdn.bootcss.com/normalize/5.0.0/normalize.min.css" rel="stylesheet">
		<link rel="stylesheet" href="vendor/font-awesome-4.6.3/css/font-awesome.min.css" />
		<!--<link rel='stylesheet' id='javin-font-css'  href='http://static.jiawin.com/wp-content/themes/jiawin/css/font-awesome.min.css?ver=1463202082' type='text/css' media='all' />-->
		<link rel="stylesheet" href="dist/core.css" />
		<script src="vendor/jquery.js" type="text/javascript" charset="utf-8"></script>
		<script src="vendor/lazyload-js.js" type="text/javascript" charset="utf-8"></script>
		
		<!--[if lt IE 9]>
			<script src="http://cdn.bootcss.com/html5shiv/r29/html5.js"></script>
			<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->
	</head>
	<body>
		<header class="common-header">
			<div class="wrapper">
				<div class="common-header-topbar">
					<a href="" class="common-header-topbar-logo">
						<img class="lazy" src="img/about/07-02_03.png" data-original="img/about/07-02_03.png"/>
					</a>
					<div class="common-header-topbar-link clearfix">
						<i class="fa fa-twitter"></i>
						<i class="fa fa-facebook-f"></i>
						<i class="fa fa-rss"></i>
					</div>
				</div>
				<div class="common-header-site clearfix">					
					<ul class="about-nav">
						<li><a href="home.html">HOME</a></li>
						<li><a href="portfolio.html">PORTFOLIO</a></li>
						<li><a href="about.html">ABOUT</a></li>
						<li><a href="service.html">SERVICES</a></li>
						<li><a href="archive.html">ARCHIVE</a></li>
						<li><a href="blog.html">BLOG</a></li>
						<li><a href="blog-detail.html" class="about-nav-active">OTHER PAGES</a></li>
						<li><a href="contact-us.html">CONTACT US</a></li>
					</ul>
					<i class="fa fa-search"></i>
				</div>
				<div class="common-header-nav-bar">
					<i class="fa fa-bars" id="navbar"></i>
					<i class="fa fa-user"></i>
					<p><a href="#"><img src="img/index/07-02_03.png" alt="" /></a></p>
				</div>
				<ul class="common-header-hide-nav" id="hidenav">
					<li><a href="home.html">HOME</a></li>
					<li><a href="portfolio.html">PORTFOLIO</a></li>
					<li><a href="about.html" >ABOUT</a></li>
					<li><a href="service.html">SERVICES</a></li>
					<li><a href="ARCHIVE.html">ARCHIVE</a></li>
					<li><a href="blog.html">BLOG</a></li>
					<li><a href="blog-detail.html" class="about-nav-active">OTHER PAGES</a></li>
					<li><a href="contact-us.html">CONTACT US</a></li>
				</ul>
			</div>
			<div class="title">
				<div class="wrapper">
					<h1>OTHER PAGES</h1>
				</div>
			</div>
		</header>
		<section class="blog-container">
			<div class="container-inner clearfix">
				<section class="inner-content-left">
					<div class="blog-detail-content-left-part content-left-part">
						<img class="lazy" src="img/blog/pic1.jpg" data-original="img/blog/pic1.jpg" alt="" />
						<h3 data-scroll-reveal="enter left and then ease-in-out 50px">7 Strategies to Market Your Business Online</h3>
						<div class="part-button-wrapper">
							<a class="part-button" data-scroll-reveal="enter left and then ease-in-out 50px">
								<i class="button-icon fa fa-calendar"></i>
								July 3, 2013
							</a>
							<a class="part-button" data-scroll-reveal="enter left wait 0.2s and then ease-in-out 50px">
								<i class="button-icon fa fa-user"></i>
								Michael Reimer
							</a>
							<a class="part-button" data-scroll-reveal="enter left wait 0.4s and then ease-in-out 50px">
								<i class="button-icon fa fa-bookmark"></i>
								Marketing, News
							</a>
							<a class="part-button" data-scroll-reveal="enter left wait 0.6s and then ease-in-out 50px">
								<i class="button-icon fa fa-commenting-o"></i>
								2 Comments
							</a>
						</div>
						<p class="part-describe" data-scroll-reveal="enter top  and then ease-in-out 50px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer egestas erat sit amet nisi mattis, sed bibendum quam ultricies. Suspendisse eget auctor quam. Aliquam sapien ante, condimentum quis ipsum quis, scelerisque porta nisl. Nulla facilisi. Maecenas non rutrum felis. Aenean sed felis sit amet nisi feugiat laoreet. Duis sit amet lectus vitae massa laoreet hendrerit. Maecenas tempor aliquet viverra. Fusce quis consequat eros, fermentum malesuada urna.</p>
						<br />
						<p class="part-describe" data-scroll-reveal="enter bottom and then ease-in-out 50px">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer egestas erat sit amet nisi mattis, sed bibendum quam ultricies. Suspendisse eget auctor quam. Aliquam sapien ante, condimentum quis ipsum quis, scelerisque porta nisl. Nulla facilisi. Maecenas non rutrum felis. </p>
						<hr class="blog-detail-hr" />
										
						<div class="part-madia">
							<img class="lazy" src="img/blog/media-pic1.jpg" data-original="img/blog/media-pic1.jpg"  data-scroll-reveal="enter left and then ease-in-out 50px"/>
							<span class="madia-box-pic" data-scroll-reveal="enter left wait 0.2s and then ease-in-out 50px">128</span>
							<img class="lazy" src="img/blog/media-pic2.jpg" data-original="img/blog/media-pic2.jpg" data-scroll-reveal="enter left wait 0.4s and then ease-in-out 50px"/>
							<span class="madia-box-pic" data-scroll-reveal="enter left wait 0.6s and then ease-in-out 50px">259</span>
							<img class="lazy" src="img/blog/media-pic3.jpg" data-original="img/blog/media-pic3.jpg" data-scroll-reveal="enter left wait 0.8s and then ease-in-out 50px"/>
							<span class="madia-box-pic" data-scroll-reveal="enter left wait 1s and then ease-in-out 50px">32</span>
						</div>
					</div>
					
					<div class="blog-detail-content-left-part content-left-comments">
						<h3 data-scroll-reveal="enter top and then ease-in-out 50px">Comments</h3>
						<hr />
						<dl class="part-coments-item">
							<dt><img src="img/blog/user1.jpg" alt="" /></dt>
							<dd class="item-information" data-scroll-reveal="enter top and then ease-in-out 100px">
								<time>July 11, 2013  /  Reply</time>
								<span class="name">Matt Adams</span>
								<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dap ibus diam.</p>
								<hr />
							</dd>
						</dl>
						
						<dl class="part-coments-item">
							<dt><img src="img/blog/user1.jpg" alt="" /></dt>
							<dd class="item-information" data-scroll-reveal="enter top and then ease-in-out 100px">
								<time>July 11, 2013  /  Reply</time>
								<span class="name">Steve Smith</span>
								<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dap ibus diam.</p>
								<hr />
							</dd>
						</dl>
						
						<dl class="part-coments-item">
							<dt><img src="img/blog/user2.jpg" alt="" /></dt>
							<dd class="item-information" data-scroll-reveal="enter top and then ease-in-out 100px">
								<time>July 11, 2013  /  Reply</time>
								<span class="name">Matt Adams</span>
								<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dap ibus diam.</p>
							</dd>
						</dl>
					</div>
					
					<form onsubmit="return forms()" action="" method="post" class="blog-detail-content-left-part content-left-comment">
						<h3 data-scroll-reveal="enter left and then ease-in-out 50px">Leave a Comment</h3>
						<hr />
						<div class="comment-user-information clearfix" data-scroll-reveal="enter left wait 0.1s and then ease-in-out 50px">
							<input type="text" name="" id="name" value="" onfocus="onfocusName()" onblur="onblurName()"/>
							<label for="name">
								<span class="information-item">NAME</span>
								<p class="information-describe ">Your full name please.</p>
							</label>
							<div class="information-tip">
								<i class="triangles" id="triangle1"><i></i></i><i id="name-tip" class="tip"></i>
							</div>
						</div>
						
						<div class="comment-user-information clearfix"  data-scroll-reveal="enter left wait 0.2s  and then ease-in-out 50px">
							<input type="text" name="" id="email" value="" onfocus="onfocusEmail()" onblur="onblurEmail()"/>
							<label for="email">
								<span class="information-item">EMAIL　ADDRESS</span>
								<p class="information-describe ">Used for gravatar.</p>
							</label>
							<div class="information-tip">
								<i class="triangles" id="triangle2"><i></i></i><i id="email-tip" class="tip"></i>
							</div>
						</div>
						
						<div class="comment-user-information clearfix"  data-scroll-reveal="enter left wait 0.3s  and then ease-in-out 50px">
							<input type="text" name="" id="emails" value="" onfocus="onfocusEmails()" onblur="onblurEmails()"/>
							<label for="emails">
								<span class="information-item">WESITE</span>
								<p class="information-describe ">Link back if you want.</p>
							</label>
							<div class="information-tip">
								<i class="triangles" id="triangle4"><i></i></i><i id="emails-tip" class="tip"></i>
							</div>
						</div>
						
						<textarea class="comment-user-information comment-user-input-box" name="" rows="" cols=""></textarea>
						
						<input class="comment-user-send" onclick="forms()" type="submit" id="" name="" value="SEND MESSMAGE"  data-scroll-reveal="enter bottom and then ease-in-out 50px"/>
						
					</form>
					
				</section>
				
				<section class="inner-content-right">
					<div class="content-right-part">
						<h3 data-scroll-reveal="enter from the top after 0.5s">Popular Posts</h3>
						<p data-scroll-reveal="enter right and then ease-in-out 50px">New Premium WordPress Theme - Blaco</p>
						<hr />
						<p data-scroll-reveal="enter right wait 0.1s and then ease-in-out 50px">Top Web Trends of 2013</p>
						<hr />
						<p data-scroll-reveal="enter right wait 0.2s and then ease-in-out 50px">Video Post Example</p>
						<hr />
						<p data-scroll-reveal="enter right wait 0.3s and then ease-in-out 50px">How Important is Twitter</p>
						<hr />
						<p data-scroll-reveal="enter right wait 0.4s and then ease-in-out 50px">Home Builders New Planning Solution</p>
					</div>

					<div class="content-right-part">
						<h3 data-scroll-reveal="enter from the top after 0.5s">Blog categories</h3>
						<p data-scroll-reveal="enter right and then ease-in-out 50px">News (4)</p>
						<p data-scroll-reveal="enter right wait 0.1s and then ease-in-out 50px">Website Releases (23)</p>
						<p data-scroll-reveal="enter right wait 0.2s and then ease-in-out 50px">Events (7)</p>
						<p data-scroll-reveal="enter right wait 0.3s and then ease-in-out 50px">Marketing (5)</p>
						<p data-scroll-reveal="enter right wait 0.4s and then ease-in-out 50px">Web Development (2)</p>
					</div>

					<div class="content-right-part">
						<h3 data-scroll-reveal="enter from the top after 0.5s">ARCHIVEs</h3>
						<p data-scroll-reveal="enter right and then ease-in-out 50px">March (4)</p>
						<p data-scroll-reveal="enter right wait 0.1s and then ease-in-out 50px">April (5)</p>
						<p data-scroll-reveal="enter right wait 0.2s and then ease-in-out 50px">May (3)</p>
						<p data-scroll-reveal="enter right wait 0.3s and then ease-in-out 50px">June (4)</p>
						<p data-scroll-reveal="enter right wait 0.4s and then ease-in-out 50px">July (2)</p>
					</div>
				</section>
			</div>
		</section>
		<footer class="common-footer">
			<div class="wrapper">
				<div class="common-footer-centent clearfix">
					<article class="common-footer-centent-left">
						<a href="" class="common-header-topbar-logo">
							<img src="img/about/捕获.JPG" data-original="img/about/捕获.JPG" data-scroll-reveal="enter left wait 1s and then ease-in-out 50px">
						</a>
						<div class="common-header-topbar-link clearfix" data-scroll-reveal="enter left and then ease-in-out 50px">
							<i class="fa fa-twitter"></i>
							<i class="fa fa-facebook-f"></i>
							<i class="fa fa-rss"></i>
						</div>
						<p data-scroll-reveal=" then ease-in-out 50px">
							Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum gravida quam quis nunc rutrum placerat. Proin eu mi vitae neque veh interdum id nec turpis nam auctor faucibus sollicitudin.
						</p>
					</article>
					<article>
						<dl>
							<dt data-scroll-reveal="enter top and then ease-in-out 50px">CONTACT INFO</dt>
							<dd data-scroll-reveal="enter bottom and then ease-in-out 50px">222 Ave C South</dd>
							<dd data-scroll-reveal="enter bottom wait 0.2s and then ease-in-out 50px">Saskatoon</dd>
							<dd data-scroll-reveal="enter bottom wait 0.4s and then ease-in-out 50px">Canada S7K 2N5</dd>
							<dd data-scroll-reveal="enter bottom wait 0.6s and then ease-in-out 50px">info@deliver.ca</dd>
							<dt class="num" data-scroll-reveal="enter bottom wait 0.8s and then ease-in-out 50px">1.306.222.3456</dt>
						</dl>
					</article>
					<article>
						<dl class="quicklinks">
							<dt data-scroll-reveal="enter top and then ease-in-out 50px">QUICK LINKS</dt>
							<dd data-scroll-reveal="enter bottom and then ease-in-out 50px"><i class="fa fa-chevron-right"></i>Portfolio</dd>
							<dd data-scroll-reveal="enter bottom wait 0.2s and then ease-in-out 50px"><i class="fa fa-chevron-right"></i>About </dd>
							<dd data-scroll-reveal="enter bottom wait 0.4s and then ease-in-out 50px"><i class="fa fa-chevron-right"></i>ARCHIVE</dd>
							<dd data-scroll-reveal="enter bottom wait 0.6s and then ease-in-out 50px"><i class="fa fa-chevron-right"></i>Blog</dd>
							<dd data-scroll-reveal="enter bottom wait 0.8s and then ease-in-out 50px"><i class="fa fa-chevron-right"></i>Dropdown</dd>
							<dd data-scroll-reveal="enter bottom wait 1s and then ease-in-out 50px"><i class="fa fa-chevron-right"></i>contact Us</dd>
						</dl>
					</article>
					<article class="common-footer-centent-right">
						<dl>
							<dt data-scroll-reveal="enter right and then ease-in-out 50px">NEWSLTTER</dt>
							<dd data-scroll-reveal="ease-in-out 50px">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</dd>
						</dl>
						<input type="text" name="" id="" value="" placeholder="Emali" data-scroll-reveal="enter right and then ease-in-out 50px"/>
						<a href="#" class="ok" data-scroll-reveal="enter right and then ease-in-out 50px">OK</a>
					</article>
				</div>
				<div class="common-footer-button">
					<span class="copyright">
						copyright 2013
						<a href="#">Deliver</a>						
						. All Rights Reserved.
					</span>
					<span class="friendlink">
						<a href="#">ABOUT/</a>
						<a href="#">PRIVACY POLICY/</a>
						<a href="#">CONTACT</a>
					</span>
				</div>
			</div>
		</footer>
		
		<script type="text/javascript" charset="utf-8">
			$(function() {
				$("img").lazyload({
					placeholder: "images/loading.gif",
					effect: "fadeIn"
				});
			});
		</script>
		<script src="dist/core.js" type="text/javascript"></script>
		<script src="vendor/scrollReveal.js"></script>
		<script>
			(function() {
				window.scrollReveal = new scrollReveal({
					reset: true,
					move: '50px'
				});
			})();
		</script>
	</body>
</html>
